<template>
	<view class="content" v-show="orderInfo">
		<view class="address-order">
			
			<view class="order">
				<!-- v-for="(item,index) in orderInfo" -->
				<view class="order-li" >
					<image :src="'https://www.sdxiecheng.cn/'+orderInfo.goods_image" mode=""></image>
					<view class="order-li-right">
						<view class="name">{{orderInfo.goods_title}}</view>
						<view class="des">{{orderInfo.goods_describle}}</view>
						<view class="price">¥{{orderInfo.total_fee}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="order-info">
			<view class="shouhou-li" v-if="orderInfo.pay_type != 'card'">
				退款金额：￥{{ orderInfo.total_fee}}
			</view>
			<view class="shouhou-li" v-if="orderInfo.card_type.card_curing_type">
				会员支付：{{ orderInfo.card_type.card_curing_type }}
			</view>
			<view class="shouhou-li" v-if="orderInfo.card_type.card_fine_type">
				会员支付：{{ orderInfo.card_type.card_fine_type }}
			</view>
			<view class="shouhou-li" v-if="orderInfo.card_type.card_general_type">
				会员支付：{{ orderInfo.card_type.card_general_type }}
			</view>
			<view class="shouhou-li">
				<view>退款原因</view>
				<textarea  v-model="refund_desc" placeholder="请输入退款原因..." />
			</view>
			<view class="btn-box" style="padding-bottom: 0;">
				<button class="u-reset-button btn3" @click="postFefund" >提交</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				action:'',
				guiziShow:false,
				guiziChengGongShow:false,
				confirmStyle:{
					'borderLeft': '1px solid #EEEEEE'
				},
				type:'',
				id:'',
				order_id:"",
				orderInfo:'',
				num:'',
				refund_desc:'',
				index:0
			}
		},
		onLoad(e) {
			console.log(e)
			console.log("传递")
			this.type = e.type
			this.id = e.id
			this.order_id=e.order_id
			this.index = e.index-0
			this.getDcxOrder()
		},
		methods: {
			isPay(){
				this.guiziShow = true
			},
			// 待存订单详情
			getDcxOrder(){
				uni.$u.http.post('order/detailon',{
					id:this.id
				}).then(res =>{
					console.log(res)
					this.orderInfo = res.data
					console.log(this.orderInfo)
					console.log("订单信息")

				})
			},
			// 申请退款  
			postFefund(){
				let that = this
				uni.request({
					url:"https://www.sdxiecheng.cn/addons/epay/api/refundon",
				    // url: 'https://www.sdxiecheng.cn/addons/epay/api/refund', 
					method:'POST',
				    data: {
						id:that.order_id,
				        user_id: uni.getStorageSync('userId'),
						openid: uni.getStorageSync('openid'),
						refund_type:that.orderInfo.pay_type,
						refund_desc:that.refund_desc,
						refund_fee:that.orderInfo.total_fee
				    },
				    success: (res) => {
				        console.log(res.data);
						if(res.data.code == 200){
							uni.showToast({
								icon:'success',
								title:res.data.msg
							})
							uni.$emit('updateOrder',{index:that.index})
							setTimeout(()=>{
								uni.navigateBack({
									delta:1
								})
							},500)
							
						}else{
							uni.showToast({
								icon:'none',
								title:res.data.msg
							})
						}
						
						// that.cabinet = res.data.data.cabinet
						// that.coupon = res.data.data.coupon
						// that.goods = res.data.data.goods
						// that.generateOrder()
				    },
					fail: (err) => {
						console.log(err)
					}
				});
			}
		}
	}
</script>

<style lang="less">
	.content{
		padding: 10rpx 20rpx;
	}
.address-order{
	background: #FFFFFF;
	border-radius: 10rpx;
	.address{
		padding: 30rpx;
		padding-bottom: 40rpx;
		background: url('https://www.sdxiecheng.cn/img/address-line.png') bottom no-repeat;
		background-size: 100%;
		.name{
			image{
				width: 24rpx;
				height: 30rpx;
				margin-right: 19rpx;
			}
			font-size: 30rpx;
			color: #333;
			font-weight: bold;
			margin-bottom: 27rpx;
		}
		.address-des{
			color: 24rpx;
			color: #666666;
		}
	}
}
// 订单样式
.order{
	padding: 0 9rpx;
	padding-top: 34rpx;
	.order-li{
		display: flex;
		align-items: center;
		padding-bottom: 35rpx;
		image{
			width: 150rpx;
			height: 150rpx;
			border-radius: 10rpx;
			overflow: hidden;
		}
		.order-li-right{
			width: calc(100% - 150rpx);
			padding-left: 20rpx;
			.name{
				font-size: 30rpx;
			}
			.des{
				font-size: 24rpx;
				margin-top: 9rpx;
				margin-bottom: 9rpx;
			}
			.price{
				font-size: 36rpx;
				font-weight: 500;
				color: #FF9A33;
			}
		}
		
	}
}
// 订单信息
.order-info{
	min-height: 654rpx;
	background: #FFFFFF;
	// border-radius: 10rpx;
	border-radius:  0 0 10rpx 10rpx;
	border-top: 1px solid #EEEEEE;
	// margin-top: 20rpx;
	padding: 39rpx 21rpx;
	.order-info-li{
		display: flex;
		align-items: center;
		line-height: 60rpx;
		font-size: 30rpx;
	}
	.shuxiang{
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		.name{
			margin-bottom: 20rpx;
		}
		image{
			width: 209rpx;
			height: 209rpx;
		}
	}
}
// 配送信息
.peisong{
	margin-top: 50rpx;
	.title{
		font-size: 30rpx;
		font-weight: 500;
	}
	.image-list{
		display: flex;
		align-items: center;
	}
	.image-li{
		width: 180rpx;
		margin-right: 30rpx;
		image{
			width: 180rpx;
			height: 180rpx;
			margin-bottom: 18rpx;
		}
		text{
			font-size: 28rpx;
			color: #7C7C7C;
			text-align: center;
		}
	}
}
.btn-box{
	padding-bottom: 98rpx;
	.btn3{
		width: 650rpx;
		height: 80rpx;
		background: #FBAA27;
		border-radius: 40rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 150rpx;
		color: #FFFFFF;
		font-size: 30rpx;
		font-weight: bold;
	}
}

// 底部按钮
.order-bottom-box{
	width: 100%;
	height: 98rpx;
	position: fixed;
	left: 0;
	bottom: 0;
	background: #FFFFFF;
	padding: 0 30rpx;
	.order-bottom-info{
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.price{
			font-size: 36rpx;
			font-weight: 500;
			text{
				color: #FF9A33;
			}
		}
		button{
			margin: 0 ;
			width: 200rpx;
			height: 70rpx;
			border-radius: 35rpx;
			color: #FFFFFF;
			font-size: 32rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			background: #FF9A33;
		}
	}
}
// 售后
.shouhou-li{
	font-size: 30rpx;
	font-weight: 500;
	line-height: 60rpx;
	textarea{
		width: 100%;
		height: 200rpx;
		border: 2rpx solid #F2F2F2;
		padding: 20rpx;
		font-weight: normal;
		margin-top: 20rpx;
		border-radius: 10rpx;
		box-sizing: border-box;
		line-height: normal;
	}
}
</style>
